{% extends 'bbs/base.html' %}

{% block title %} YYin's home {% endblock%}

{% block content %}
    <div class="panel panel-default panel-body" style="min-height:300px">
        <div class="col-md-4">
            <img src="http://images.china.cn/attachement/jpg/site1000/20150821/6c0b840a258b174110364c.jpg" alt="smiley-face" class="img-thumbnail" style="max-width:100%;height:auto" />
        </div>
        <div class="col-md-8">
            <h3 onclick='location.href="show.html"'>Example page header <small>Subtext for header</small></h3>
            <div class="barcode"><span class="glyphicon glyphicon-qrcode"></span></div>
            <div class="row" style="padding-bottom:10px;">
                <span class="col-md-3 text-muted">2015-08-20</span>
                <span class="col-md-6 text-muted text-center">java</span>
                <span class="col-md-3 text-muted text-right">0 条评论</span>
            </div>

            <div style="min-height:120px;border-top:1px #EEE solid;border-bottom:1px #EEE solid;padding:10px;">
                <p>
            Data API 方式

如果使用 data-* API 方式，任何参数都需要以 data 属性的形式出现。所有以 data-* API 传递的参数都将与默认参数合并。通过传递 JSON 对象可以改变 headroom.js 默认设置的 CSS class。
                </p>
                <p>
用CSS实现右对齐，这似乎是一个太过基础的例子啊，不过越基础越容易出错，有时候甚至找不到头绪了，这也是我本人在刚开始写CsS的时候所遇到的问题，今天才次向CSS初学者演示一款极其简单的CSS右对齐代码，希望对你的前端设计开发有所帮助。代码如下：
                </p>
                <p>
其实这里最主要的一个CSS属性就是float:right，也就是浮动属性：右对齐，也可以改成float:left，改成这样后，想一想，你可以扩展出许多的网页布局，比如最基础的网站导航菜单、友情链接列表、一行两列的文字列表等。
                </p>
            </div>

            <div class="row" style="padding-top:10px;">
                <span class="col-md-10">
                    <button type="button" class="btn btn-default label label-default">Java</button>
                    <button type="button" class="btn btn-default label label-default">PHP</button>
                    <button type="button" class="btn btn-default label label-default">C</button>
                    <button type="button" class="btn btn-default label label-default">C++</button>
                </span>
                <span class="col-md-2 text-muted text-right" onclick="location.href=show.html">继续阅读 >></span>
            </div>
        </div>
    </div>

{% endblock %}

